<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Roker  - Corporate, Creative, Multi Purpose, Responsive And Retina Template</title> 
    <meta name="keywords" content="HTML5 Template" />
    <meta name="description" content="Roker  - Corporate, Creative, Multi Purpose, Responsive And Retina Template">
    <meta name="author" content="iwthemes.com">   

    <!-- Mobile Metas -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Theme CSS -->
    <link href="css/style.css" rel="stylesheet" media="screen">

    <!-- Skins Theme -->
    <link href="#" rel="stylesheet" media="screen" class="skin">

    <!-- Favicons -->
    <link rel="shortcut icon" href="img/icons/favicon.ico">
    <link rel="apple-touch-icon" href="img/icons/apple-touch-icon.png">
    <link rel="apple-touch-icon" sizes="72x72" href="img/icons/apple-touch-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="114x114" href="img/icons/apple-touch-icon-114x114.png">  

    <!-- Head Libs -->
    <script src="js/modernizr.js"></script>

    <!--[if lte IE 9]>
        <script src="http://getbootstrap.com/docs-assets/js/html5shiv.js"></script>
        <script src="js/responsive/respond.js"></script>
    <![endif]-->

    <!-- styles for IE -->
    <!--[if lte IE 8]>
        <link rel="stylesheet" href="css/ie/ie.css" type="text/css" media="screen" />            
    <![endif]-->

    <!-- Skins Changer-->
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
   
  </head>
  <body> 

     <!-- Theme-options -->
    <div id="theme-options">
            <div class="title">Theme Options<span title="Theme Options"><i class="fa fa-cogs right"></i></span></div>
            <span>COLORS</span>
            <ul id="colorchanger">      
                <li><a class="colorbox blue" href="?theme=blue" title="Blue Skin"></a></li>
                <li><a class="colorbox red" href="?theme=red" title="Red Skin"></a></li>
                <li><a class="colorbox yellow" href="?theme=yellow" title="Yellow Skin"></a></li>
                <li><a class="colorbox green" href="?theme=green" title="Green Skin"></a></li>
                <li><a class="colorbox orange" href="?theme=orange" title="Orange Skin"></a></li>
                <li><a class="colorbox purple" href="?theme=purple" title="Purple Skin"></a></li>
                <li><a class="colorbox pink" href="?theme=pink" title="Pink Skin"></a></li>
                <li><a class="colorbox cocoa" href="?theme=cocoa" title="Cocoa Skin"></a></li>
            </ul>
            <span>LAYOUT STYLE</span>
            <ul class="layout-style">      
                <li class="wide active">Wide</li>
                <li class="boxed">Boxed</li> 
                <li class="boxed-margin">Boxed Margin</li>               
            </ul>
            <span>WEBSITE TYPE</span>
           <ul class="layout-style">      
                <li class="active"><a href="index.html">Corporate</a></li>
                <li><a href="index-creative.html">Creative</a></li>
                <li><a href="index-one-page.html" >One Page</a></li>                
            </ul>  
            <div class="patterns">
                <span>BACKGROUND PATTERNS</span>
                <ul class="backgrounds">
                    <li class="bgnone" title="None - Default"></li>
                    <li class="bg1"></li>
                    <li class="bg2"></li>
                    <li class="bg3"></li>
                    <li class="bg4 "></li>
                    <li class="bg5"></li> 
                    <li class="bg6"></li>
                    <li class="bg7"></li>
                    <li class="bg8"></li>
                    <li class="bg9 "></li>
                    <li class="bg10"></li> 
                    <li class="bg11"></li>                   
                </ul>  
            </div>
    </div>
    <!-- End Theme-options -->
    
    <!-- layout-->
    <div id="layout">

        <!-- Login Client -->
        <div class="jBar">
          <div class="container">            
              <div class="row">    

                  <div class="col-md-10">
                     <div class="row padding-top-mini">
                        <!-- Item service-->
                        <div class="col-md-4">
                            <div class="item-service border-right">
                                <div class="row head-service">
                                    <div class="col-md-2">
                                        <i class="fa fa-check-square"></i>                             
                                    </div>
                                    <div class="col-md-10">
                                        <h5>Login or create new account.</h5>
                                    </div>
                                </div>  
                                <p>Pellentesque habitant morbi fames ac turpis egestas. Vestibulum tortor quam. Pellentesque habitant</p>
                            </div>
                        </div>      
                        <!-- End Item service-->

                        <!-- Item service-->
                        <div class="col-md-4">
                            <div class="item-service border-right">
                                <div class="row head-service">
                                    <div class="col-md-2">
                                        <i class="fa fa-star"></i>                             
                                    </div>
                                    <div class="col-md-10">
                                        <h5>Review your order.</h5>
                                    </div>
                                </div>  
                                <p>Pellentesque habitant morbi fames ac turpis egestas. Vestibulum tortor quam Pellentesque habitant.</p>
                            </div>
                        </div>      
                        <!-- End Item service-->

                        <!-- Item service-->
                        <div class="col-md-4">
                            <div class="item-service border-right">
                                <div class="row head-service">
                                    <div class="col-md-2">
                                        <i class="fa fa-credit-card"></i>                             
                                    </div>
                                    <div class="col-md-10">
                                        <h5>Payment And FREE shipment.</h5>
                                    </div>
                                </div>  
                                <p>Pellentesque habitant morbi fames ac turpis egestas. Vestibulum tortor quam. Pellentesque habitant</p>
                            </div>
                        </div>      
                        <!-- End Item service-->
                     </div>
                  </div>

                  <div class="col-md-2">
                      <h5>Client Login</h5>
                      <form>
                          <input type="email" placeholder="Username" required>
                          <input type="password" placeholder="Password" required>
                          <input type="submit" class="btn btn-primary" value="sign in">
                          <span>Or</span>                       
                          <input type="submit" class="btn btn-primary" value="Register">
                      </form>
                  </div>

                            
                  <span class="jTrigger downarrow"><i class="fa fa-minus"></i></span>
              </div>
          </div>
      </div>
      <span class="jRibbon jTrigger up" title="Login"><i class="fa fa-plus"></i></span>
      <div class="line"></div>
      <!-- End Login Client -->

        <!-- Info Head -->
        <section class="info-head">  
            <div class="container">
                <ul>  
                    <li><i class="fa fa-headphones"></i> 01800034567</li>
                    <li><i class="fa fa-comment"></i> <a href="#">Live chat</a></li>
                    <li>
                        <ul>
                          <li class="dropdown">
                            <i class="fa fa-globe"></i> 
                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                Language<i class="fa fa-angle-down"></i>
                            </a>
                             <ul class="dropdown-menu">  
                                 <li><a href="#"><img src="img/language/spanish.png" alt="">Spanish</a></li>
                                 <li><a href="#"><img src="img/language/english.png" alt="">English</a></li>
                                 <li><a href="#"><img src="img/language/frances.png" alt="">Frances</a></li>
                                 <li><a href="#"><img src="img/language/portugues.png" alt="">Portuguese</a></li>
                            </ul>
                          </li>                      
                        </ul>
                    </li>
                </ul> 
            </div>            
        </section>
        <!-- Info Head -->

        <!-- Header-->
        <header class="animated fadeInDown delay1">           
            <div class="container">
                <div class="row">

                    <!-- Logo-->
                    <div class="col-md-3 logo">
                        <a href="index.html" title="Return Home">                            
                            <img src="img/logo.png" alt="Logo" class="logo_img">
                        </a>
                    </div>
                    <!-- End Logo-->
                                                      
                    <!-- Nav-->
                    <nav class="col-md-9">
                        <!-- Menu-->
                        <ul id="menu" class="sf-menu">
                            <li>
                                <a href="index.html">HOME <i class="fa fa-angle-down"></i></a>
                                <ul>                                  
                                    <li><a href="index.html">Home Corporate</a></li>
                                    <li><a href="index-creative.html">Home Creative</a></li>
                                    <li><a href="index-alternative.html">Home Alternative</a></li>
                                    <li><a href="index-one-page.html">Home One Page</a></li>
                                </ul>
                            </li>
                            <li><a href="about.html">ABOUT</a></li>
                            <li><a href="services.html">SERVICES <i class="fa fa-angle-down"></i></a>
                                <ul>                                  
                                    <li><a href="services.html">Services Default</a></li>
                                    <li><a href="services-options.html">6 services options</a></li><li><a href="http://www.weidea.net">More</a></li>
                                </ul>
                            </li>
                            <li>
                                <a href="feature-princing-tables.html">FEATURES <i class="fa fa-angle-down"></i></a>
                                <ul>
                                    <li>
                                        <a href="#">Sliders Options<i class="fa fa-angle-right"></i></a>
                                        <ul>
                                            <li><a href="index.html">Camera Slider Advance Captions</a></li>
                                             <li><a href="index-one-page.html">Camera Slider Simple Captions</a></li>
                                            <li><a href="index-alternative.html">Flex Slider ( Video option)</a></li>
                                        </ul>
                                    </li>    
                                    <li>
                                        <a href="#">Pages <i class="fa fa-angle-right"></i></a>
                                        <ul>
                                            <li><a href="page-register.html">Register User</a></li>                              
                                            <li><a href="page-full-width.html">Full Width</a></li>
                                            <li><a href="page-left-sidebar.html">Left Sidebar</a></li>
                                            <li><a href="page-right-sidebar.html">Right Sidebar</a></li>
                                            <li><a href="page-404.html">404 Page</a></li>
                                            <li><a href="page-faq.html">FAQ</a></li>
                                            <li><a href="sitemap.html">Sitemap</a></li>
                                         </ul>
                                    </li> 
                                    <li>
                                        <a href="#">Headers <i class="fa fa-angle-right"></i></a>
                                        <ul>
                                            <li><a href="feature-header-1.html">Header Version 1</a></li>
                                            <li><a href="feature-header-2.html">Header Version 2</a></li>
                                            <li><a href="feature-header-3.html">Header Version 3</a></li>
                                        </ul>
                                    </li> 
                                    <li>
                                        <a href="#">Footers <i class="fa fa-angle-right"></i></a>
                                        <ul>
                                            <li><a href="feature-footer-1.html#footer">Footer Version 1</a></li>
                                            <li><a href="feature-footer-2.html#footer">Footer Version 2</a></li>
                                            <li><a href="feature-footer-3.html#footer">Footer Version 3</a></li>
                                        </ul>
                                    </li>                           
                                    <li><a href="feature-princing-tables.html">Princing Tables</a></li>
                                    <li><a href="feature-grid-system.html">Grind System</a></li>
                                    <li><a href="feature-typograpy.html">Tipograpy</a></li>
                                    <li><a href="feature-icons.html">Icons</a></li>
                                    <li><a href="feature-elements.html">Elements</a></li>
                                 </ul>
                            </li>   
                            <li>
                                <a href="work-4-columns.html">WORK <i class="fa fa-angle-down"></i></a>
                                <ul>                                  
                                    <li><a href="work-4-columns.html">4 Columns</a></li>
                                    <li><a href="work-3-columns.html">3 Columns</a></li>
                                    <li><a href="work-2-columns.html">2 Columns</a></li>
                                    <li><a href="single-work.html">Single Work</a></li>
                                </ul>
                            </li>                                
                                <li>
                                <a href="blog.html">BLOG <i class="fa fa-angle-down"></i></a>
                                <ul>                                  
                                    <li><a href="blog.html">Post</a></li>
                                    <li><a href="blog-post.html">Single Post</a></li>
                                </ul>
                            </li>                                                                        
                            <li><a href="contact.html">CONTACT</a></li>
                        </ul>
                        <!-- End Menu-->
                    </nav>
                    <!-- End Nav-->
                    
                </div><!-- End Row-->
            </div><!-- End Container-->
        </header>
        <!-- End Header-->


          <!-- Slide -->
          <section class="slider">
            <div class="flexslider">
                  <ul class="slides">
                    
                    <li class="bg-img bg-img-1 slider-1">
                        <div class="style_one">
                            <div class="container">
                                <div class="row">                                
                                    <div class="col-md-6">
                                        <h1 class="animated bounceInRight delay1">
                                            VIDEO DEMO
                                            <span>
                                                <span> ORIGINAL DESING</span>
                                            </span>
                                        </h1>
                                        <p class="lead animated bounceInUp delay2">We develop original products, innovative and  quality high.</p>
                                        <a  class="btn btn-lg btn-primary animated bounceInUp delay3" href="#">View More</a>
                                    </div>
                                    <div class="col-md-6">
                                        <iframe src="//www.youtube.com/embed/ST_t3bgYPDk"></iframe>
                                    </div>
                                </div>  
                            </div>                                                                                         
                        </div>
                    </li>

                    <li class="bg-img bg-img-2 slider-2">
                       <div class="style_one">
                            <div class="container">
                                <div class="row">     
                                    <div class="col-md-6">
                                        <iframe src="//www.youtube.com/embed/ST_t3bgYPDk"></iframe>
                                    </div>                           
                                    <div class="col-md-6">
                                        <h1 class="animated bounceInRight delay1">
                                            VIDEO DEMO
                                            <span>
                                                <span> LEFT DEMO </span>
                                            </span>
                                        </h1>
                                        <p class="lead animated bounceInUp delay2">We develop original products, innovative and  quality high.</p>
                                        <a  class="btn btn-lg btn-primary animated bounceInUp delay3" href="#">View More</a>
                                    </div>                                    
                                </div>  
                            </div>                                                                                         
                        </div>
                    </li>

                    <li class="bg-img bg-img-3 slider-3">
                        <div class="style_two"> 
                            <h1 class="animated bounceInDown delay1">
                                CLEAN AND EASY
                                <span>
                                    BASED  ON BOOTSTRAP 3.0
                                    <span class="border"></span>
                                </span>
                            </h1>
                            <p class="lead animated bounceInUp delay2">We develop original products, innovative and  quality high.</p>
                             <a class="btn btn-lg btn-primary animated bounceInUp delay3" href="#">View More</a>
                        </div>
                    </li>

                  </ul>
                </div>
          </section>
          <!-- end Slide -->


        <!-- box-action -->
        <section class="box-action">
            <div class="container">
                <div class="title">
                    <p class="lead">Implement an action bar at any section of the page!</p>
                </div>
                <div class="button">
                    <a href="http://themeforest.net/user/iwthemes/portfolio?ref=iwthemes" target="_blank">BUY NOW</a>
                    <span class="arrow_box_action"></span>
                </div>
            </div>
        </section>
        <!-- End box-action-->


        <!-- Clients -->
        <section class="paddings">
            <div class="container">
               <div class="row">  

                    <div class="col-md-5">
                        <!-- Simple-slide --> 
                        <div id="carousel-example-generic" class="carousel slide bs-docs-carousel-example">
                            <ol class="carousel-indicators">
                                <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                                <li data-target="#carousel-example-generic" data-slide-to="1" class=""></li>
                                <li data-target="#carousel-example-generic" data-slide-to="2" class=""></li>
                            </ol>
                            <div class="carousel-inner">
                                <div class="item active">
                                    <img src="img/works/1.jpg" alt="">
                                </div>
                                <div class="item">
                                    <img src="img/works/2.jpg" alt="">
                                </div>
                                <div class="item">
                                    <img src="img/works/3.jpg" alt="">
                                </div>
                            </div>
                            <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
                                <span class="icon-prev"></span>
                            </a>
                            <a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
                                <span class="icon-next"></span>
                            </a>
                        </div>
                        <!-- End Simple-slide --> 
                    </div>

                    <!-- Feature-->
                    <div class="col-md-7">
                          <!-- feature-element  -->
                            <ul class="feature-element">
                                 <!-- Item feature-element  -->
                                 <li>       
                                 <div class="row">
                                     <div class="col-md-5">
                                        <div class="line-feature"><i class="fa fa-angle-left"></i></div>
                                        <i class="fa fa-mobile cirle-feature"></i>
                                    </div>
                                    <div class="col-md-7">
                                         <div class="text-feature">
                                         <h4>Fully Responsive</h4>
                                        Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</div>
                                     </div>
                                </div>   
                            </li>
                                <!-- End Item feature-element  -->

                             <!-- Item feature-element  -->
                             <li>       
                                <div class="row">
                                    <div class="col-md-5">
                                        <div class="line-feature"><i class="fa fa-angle-left"></i></div>
                                        <i class="fa fa-hand-o-right cirle-feature"></i>
                                    </div>
                                    <div class="col-md-7">
                                        <div class="text-feature">
                                        <h4>Based On Bootstrap 3.0</h4>
                                        Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</div>
                                    </div>
                                </div>   
                            </li>
                            <!-- End Item feature-element  -->

                            <!-- Item feature-element  -->
                             <li>       
                                <div class="row">
                                    <div class="col-md-5">
                                        <div class="line-feature"><i class="fa fa-angle-left"></i></div>
                                        <i class="fa fa-bookmark cirle-feature"></i>
                                    </div>
                                    <div class="col-md-7">
                                        <div class="text-feature">
                                        <h4>Unique Design</h4>
                                        Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</div>
                                    </div>
                                </div>   
                            </li>
                            <!-- End Item feature-element  -->
                        </ul>
                        <!-- End feature-element  -->

                    </div>
                    <!-- End Feature-->

               </div>                
            </div>
        </section>
        <!-- End Clients -->


        <section class="section-gray paddings borders">
            <div class="container">
                 <!-- Table United three colums-->
                <div class="row">
                    <div class="col-md-12">

                        <!-- Title Table United three colums-->
                        <h2 class="title-subtitle">
                           United tables
                            <span>Suitable for promotions, Tables allows  only three columns.</span>
                        </h2>
                        <hr>
                        <!-- End Title Table United three colums-->
                    
                        <!-- Tables together-->
                        <ul class="tables-together padding-top">
                            
                            <!-- Item Table together-->
                            <li class="item-table">
                                <h4 class="table-header">BASIC</h4>
                                <p class="table-tagline">Small website or blog</p>
                                <div class="table-price-container">
                                    <div class="table-price">
                                        <span class="table-price-currency">$</span>
                                        <span class="table-price-whole">5</span>
                                        <span class="table-price-decimals">.96</span>
                                        <span class="table-price-period">/mo</span>                                    
                                    </div>
                                    <p class="table-price-discountinfo">Billed annually or $9.95 month-to-month</p>
                                </div>
                                <ul class="table-features">
                                    <li class="table-features-item">
                                        <strong>10</strong> Styled elements
                                    </li>
                                    <li class="table-features-item">
                                        <strong>1</strong>  Advanced admin                     
                                    </li>
                                    <li class="table-features-item">
                                        <strong>↳ 100,000</strong> users
                                    </li>
                                    <li class="table-features-item">
                                        <strong>20</strong> Email Marketing
                                    </li>
                                    <li class="table-features-item visible-phone">
                                        <strong>∞ Unlimited</strong> Users License
                                    </li>                           
                                </ul>
                                <a class="button-base button-gray" href="#">Order Now</a>
                                <p class="table-cta">Order now and <em>save $35.88</em></p>
                                <img src="img/tables/img-pricing-shadow-left.png" alt="Shadow" class="table-shadow table-shadow-left">
                            </li>
                            <!-- End Item Table together-->

                            <!-- Item Table together - highlighted -->
                            <li class="item-table table-item-highlighted">
                                <div class="table-discount"> -10%</div>
                                <h4 class="table-header">PREMIUM</h4>
                                <p class="table-tagline">Website with high traffic</p>
                                <div class="table-price-container">
                                    <div class="table-price">
                                        <span class="table-price-currency">$</span>
                                        <span class="table-price-whole">10</span>
                                        <span class="table-price-decimals">.99</span>
                                        <span class="table-price-period">/mo</span>
                                    </div>
                                    <p class="table-price-discountinfo">Billed annually or $9.95 month-to-month</p>
                                </div>
                                <ul class="table-features">
                                    <li class="table-features-item">
                                        <strong>10</strong> Styled elements
                                    </li>
                                    <li class="table-features-item">
                                        <strong>1</strong>  Advanced admin                     
                                    </li>
                                    <li class="table-features-item">
                                        <strong>↳ 100,000</strong> users
                                    </li>
                                    <li class="table-features-item">
                                        <strong>20</strong> Email Marketing
                                    </li>
                                    <li class="table-features-item visible-phone">
                                        <strong>∞ Unlimited</strong> Users License
                                    </li>                           
                                </ul>
                                <a class="button-base btn-primary" href="#">Order Now</a>
                                <p class="table-cta">Order now and <em>save $35.88</em></p>
                            </li>
                            <!-- End Item Table  together - highlighted-->

                            <!-- Item Table together-->
                            <li class="item-table">
                                <h4 class="table-header">ADVANCE</h4>
                                <p class="table-tagline">High performance applications</p>
                                <div class="table-price-container">
                                    <div class="table-price">
                                        &nbsp;                            <span class="table-price-currency">$</span>
                                        <span class="table-price-whole">15</span>
                                        <span class="table-price-decimals">.5</span>
                                        <span class="table-price-period">/mo</span>
                                    </div>
                                    <p class="table-price-discountinfo">Billed annually or $9.95 month-to-month</p>
                                </div>
                                <ul class="table-features">
                                    <li class="table-features-item">
                                        <strong>10</strong> Styled elements
                                    </li>
                                    <li class="table-features-item">
                                        <strong>1</strong>  Advanced admin                     
                                    </li>
                                    <li class="table-features-item">
                                        <strong>↳ 100,000</strong> users
                                    </li>
                                    <li class="table-features-item">
                                        <strong>20</strong> Email Marketing
                                    </li>
                                    <li class="table-features-item visible-phone">
                                        <strong>∞ Unlimited</strong> Users License
                                    </li>                           
                                </ul>
                                <a class="button-base button-gray" href="#">Order Now</a>
                                <p class="table-cta">Order now and <em>save $35.88</em></p>
                                <img src="img/tables/img-pricing-shadow-right.png" alt="Shadow" class="table-shadow table-shadow-right">
                            </li>
                            <!-- End Item Table together-->
                            
                        </ul>
                        <!-- End Tables together-->
                    </div>
                </div> 
                <!-- Table United three colums-->  
            </div>
        </section>

          <!-- Services Clasic Center -->
        <section class="paddings services">
            <div class="container">
                
                <i class="fa fa-cogs icon-section right"></i>

                <!-- Title Heading --> 
                <div class="titles-heading">
                    <div class="line"></div>
                     <h1>Unique Services
                        <span>
                          <i class="fa fa-star"></i>  
                          tristique senectus malesuada
                          <i class="fa fa-star"></i>  
                        </span>
                     </h1>
                </div> 
                <!-- End Title Heading --> 

              <!-- Row fuid-->
              <div class="row padding-top">
                 <!-- Item service-->
                  <div class="col-md-4 text-center">
                      <div class="item-service border-right">
                          <div class="row head-service">
                              <div class="col-md-12">
                                  <i class="fa fa-star"></i>                             
                              </div>
                              <div class="col-md-12">
                                  <h4>High Quality</h4>
                                  <h5>tristique senectus malesuada</h5>
                              </div>
                          </div>                          
                          <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam.</p>
                      </div>
                  </div>      
                  <!-- End Item service-->

                  <!-- Item service-->
                  <div class="col-md-4 text-center">
                      <div class="item-service border-right">
                          <div class="row head-service">
                              <div class="col-md-12">
                                 <i class="fa fa-fire"></i>                            
                              </div>
                              <div class="col-md-12">
                                  <h4>Ultra Hot Design</h4>
                                  <h5>tristique senectus malesuada</h5>
                              </div>
                          </div>                          
                          <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam.</p>
                      </div>
                  </div>      
                  <!-- End Item service-->

                  <!-- Item service-->
                  <div class="col-md-4 text-center">
                      <div class="item-service">
                          <div class="row head-service">
                              <div class="col-md-12">
                                  <i class="fa fa-cogs"></i>                    
                              </div>
                              <div class="col-md-12">
                                  <h4>Free Updates and Support</h4>
                                  <h5>tristique senectus malesuada</h5>
                              </div>
                          </div>                          
                          <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam.</p>
                      </div>
                  </div>      
                  <!-- End Item service-->
                 
              </div>
              <!-- End Row fuid-->

              <!-- Row fuid-->
              <div class="row">
                 <!-- Item service-->
                  <div class="col-md-4 text-center">
                      <div class="item-service border-right">
                          <div class="row head-service">
                              <div class="col-md-12">
                                  <i class="fa fa-thumbs-up"></i>                    
                              </div>
                              <div class="col-md-12">
                                  <h4>24/7 Support</h4>
                                  <h5>tristique senectus malesuada</h5>
                              </div>
                          </div>                          
                          <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam.</p>
                      </div>
                  </div>      
                  <!-- End Item service-->

                  <!-- Item service-->
                  <div class="col-md-4 text-center">
                      <div class="item-service border-right">
                          <div class="row head-service">
                              <div class="col-md-12">
                                  <i class="fa fa-plane"></i>                             
                              </div>
                              <div class="col-md-12">
                                  <h4>Flexible Solutions</h4>
                                  <h5>tristique senectus malesuada</h5>
                              </div>
                          </div>                          
                          <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam.</p>
                      </div>
                  </div>      
                  <!-- End Item service-->

                  <!-- Item service-->
                  <div class="col-md-4 text-center">
                      <div class="item-service">
                          <div class="row head-service">
                              <div class="col-md-12">
                                    <i class="fa fa-pencil"></i>                            
                              </div>
                              <div class="col-md-12">
                                  <h4>Original Design</h4>
                                  <h5>tristique senectus malesuada</h5>
                              </div>
                          </div>                          
                          <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam.</p>
                      </div>
                  </div>      
                  <!-- End Item service-->
                 
              </div>
              <!-- End Row fuid-->
               
            </div>
            <!-- End Container-->
        </section>
        <!-- End Services Clasic Center-->


        <!-- Sponsors -->
        <section class="sponsors">
            <div class="overflow-sponsors">
                <div class="container paddings">

                   <h2>We have  earned the trust of <span> 25,869 </span>customers , including  these fine  companies</h2>
                   
                    <!-- Sponsors -->
                    <ul id="sponsors">

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/1.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/6.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/3.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/4.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/5.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/6.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->

                        <!-- Sponsor -->
                        <li data-toggle="tooltip" title data-original-title="Tooltip Hover">
                            <a href="#"><img src="img/sponsors/logos/4.png" alt=""></a>
                        </li>  
                        <!-- Item Sponsor -->     

                    </ul>
                    <!-- End Sponsors --> 

                    <div class="circle">
                        <i class="fa fa-thumbs-up"></i>
                    </div>

                </div>
            </div>
        </section>
        <!-- End Sponsors -->
 

         <!-- footer top-->
        <footer class="footer-top">
            <div class="container">
               <div class="row">   
                   <div class="col-md-3">
                       <h3>018000-236-5899 </h3>
                   </div>
                   <div class="col-md-3">
                       <h3><a href="#">Support</a> - <a href="#">Sales</a></h3>
                   </div>
                   <div class="col-md-3">
                       <h3><a href="mailto:sales@roken.com" target="_blank">sales@roken.com</a></h3>
                   </div>
                   <div class="col-md-3">
                       <h3>24x7x365</h3>
                   </div>
               </div>                
            </div>
        </footer>      
        <!-- End footer Top-->
        
        <!-- footer Center-->
        <footer class="footer-center">
            <div class="container">

               <div class="row top">   
                   <div class="col-md-3 item-center">
                        <span class="arrow_footer"></span>
                        <i class="fa fa-phone"></i>
                        <h4>Talk to u</h4>                        
                   </div>
                   <div class="col-md-3 item-center">
                        <span class="arrow_footer"></span>
                        <i class="fa fa-comment"></i>
                        <h4>Live Chat</h4>                        
                   </div>
                   <div class="col-md-3 item-center">
                       <span class="arrow_footer"></span>
                        <i class="fa fa-envelope"></i>
                        <h4>Email Us</h4>                        
                   </div>
                   <div class="col-md-3 item-center">
                        <span class="arrow_footer"></span>
                        <i class="fa fa-thumbs-up"></i>
                        <h4>Good Support</h4>                        
                   </div>
               </div>    

                <div class="row">   
                   <div class="col-md-4">
                        <div class="border-right">
                            <i class="fa fa-twitter"></i>
                            <h4>Latest Tweet</h4>                     
                            <div class="twitter">  

                            </div>                        
                        </div>
                   </div>
                   <div class="col-md-3">
                        <div class="border-right">
                            <h4>Newsletter</h4>
                            <p>Enter your e-mail and subscribe to our newsletter.</p>

                            <form id="newsletterForm" action="php/mailchip/newsletter-subscribe.php">
                                <div class="input-group">
                                    <span class="input-group-addon">
                                        <i class="fa fa-envelope"></i>
                                    </span>
                                    <input class="form-control" placeholder="Email Address" name="email"  type="email" required="required">
                                    <span class="input-group-btn">
                                        <button class="btn btn-primary" type="submit" name="subscribe" >Go!</button>
                                    </span>
                                </div>
                            </form>   
                            <div id="result-newsletter"></div>
                       </div>
                    </div>
                    <div class="col-md-2">
                        <div class="border-right">
                            <h4>Recent Links</h4>
                            <ul class="links">
                                <li><i class="fa fa-check"></i> <a href="#">Work</a></li>
                                <li><i class="fa fa-check"></i> <a href="#">About Us</a></li>
                                <li><i class="fa fa-check"></i> <a href="#">Services</a></li>
                                <li><i class="fa fa-check"></i> <a href="#">Contact</a></li>
                            </ul>
                       </div>
                    </div>
                   <div class="col-md-3">
                        <h4>Recent flickr</h4>
                        <ul id="flickr" class="thumbs"></ul>
                   </div>
               </div>    

            </div>
        </footer>      
        <!-- End footer Center-->

        <!-- footer bottom-->
        <footer class="footer-bottom">
            <div class="container">
               <div class="row">   
                                                                  
                    <!-- Nav-->
                    <div class="col-md-8">
                        <div class="logo-footer">
                            <h2><span>R</span>oken<span>.</span></h2>
                        </div>
                        <!-- Menu-->
                        <ul class="menu-footer">
                            <li><a href="index.html">HOME</a> </li>
                            <li><a href="about.html">ABOUT</a></li>
                            <li><a href="services.html">SERVICES</a></li> 
                            <li><a href="portfolio.html">PORTFOLIO</a></li> 
                            <li><a href="blog.html">BLOG</a></li>                                                     
                            <li><a href="contact.html">CONTACT</a></li>
                        </ul>
                        <!-- End Menu-->

                        <!-- coopring-->
                       <div class="row coopring">
                           <div class="col-md-8">
                               <p>&copy; 2013 Roken . All Rights Reserved.  1995 - 2013</p>
                           </div>
                       </div>    
                       <!-- End coopring-->  

                    </div>
                    <!-- End Nav-->

                    <!-- Social-->
                    <div class="col-md-4">
                        <!-- Menu-->
                        <ul class="social">
                            <li data-toggle="tooltip" title data-original-title="Facebook">
                                <a href="#" target="_blank"><i class="fa fa-facebook"></i></a>
                            </li> 
                            <li data-toggle="tooltip" title data-original-title="Twitter">
                                <a href="#" target="_blank"><i class="fa fa-twitter"></i></a>
                            </li> 
                            <li data-toggle="tooltip" title data-original-title="Youtube">
                                <a href="#" target="_blank"><i class="fa fa-youtube"></i></a>
                            </li>                     
                        </ul>
                        <!-- End Menu-->
                    </div>
                    <!-- End Social-->

               </div> 
                    
            </div>
        </footer>      
        <!-- End footer bottom-->

    </div>
    <!-- End layout-->

    <!-- ======================= JQuery libs =========================== -->
    <!-- Always latest version of jQuery-->
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
     <!-- jQuery local-->    
    <script>window.jQuery || document.write('<script src="js/jquery.js"><\/script>')</script>    
    <!--Nav-->
    <script type="text/javascript" src="js/nav/tinynav.js"></script> 
    <script type="text/javascript" src="js/nav/superfish.js"></script>  
    <script type="text/javascript" src="js/nav/hoverIntent.js"></script> 
    <script src="js/nav/jquery.sticky.js" type="text/javascript"></script>                                          
    <!--Totop-->
    <script type="text/javascript" src="js/totop/jquery.ui.totop.js" ></script>  
    <!--Slide-->
    <script type="text/javascript" src="js/slide/camera.js" ></script>      
    <script type='text/javascript' src='js/slide/jquery.easing.1.3.min.js'></script>  
    <!--FlexSlider-->
    <script src="js/flexslider/jquery.flexslider.js"></script> 
    <!--Ligbox--> 
    <script type="text/javascript" src="js/fancybox/jquery.fancybox.js"></script> 
    <!-- carousel.js-->
    <script src="js/carousel/carousel.js"></script>  
    <!-- Twitter Feed-->
    <script src="js/twitter/jquery.tweet.js"></script> 
    <!-- flickr Feed-->
    <script src="js/flickr/jflickrfeed.min.js"></script>  
    <!--Scroll-->   
    <script src="js/scrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
    <!-- Nicescroll -->
    <script src="js/scrollbar/jquery.nicescroll.js"></script>
    <!-- Maps -->
    <script src="js/maps/gmap3.js"></script>
    <!-- Filter -->
    <script src="js/filters/jquery.isotope.js" type="text/javascript"></script>
    <!--Theme Options-->
    <script type="text/javascript" src="js/theme-options/theme-options.js"></script>
    <script type="text/javascript" src="js/theme-options/jquery.cookies.js"></script>                               
    <!-- Bootstrap.js-->
    <script type="text/javascript" src="js/bootstrap/bootstrap.js"></script>
    <!--MAIN FUNCTIONS-->
    <script type="text/javascript" src="js/main.js"></script>
    <!-- ======================= End JQuery libs =========================== -->

    <script type="text/javascript">
        //=================================== Slider  ===================================//
     
        $('.flexslider').flexslider({
          animation: "slide",
          animationLoop: true,
          itemWidth: 200,
          slideshow: true, 
          controlNav: false, 
          itemMargin: 1,
          minItems: 1,
          maxItems: 1
        });
    </script>
        
    </body>
</html>